<!--
 * @Author: krsea 965837746@qq.com
 * @Date: 2025-03-03 19:36:58
 * @LastEditors: krsea 965837746@qq.com
 * @LastEditTime: 2025-03-03 19:39:45
 * @FilePath: \vue3-code\2306\week3t\test1.html
 * @Description: 
 * 
 * Copyright (c) 2025 by ${git_name_email}, All Rights Reserved. 
-->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="app">
        <my-component :init-count='count'>	
		</my-component>		
        显示count: {{ count }}	

    </div>
	<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
    <script>
        Vue.component('my-component', {
            props: ['initCount'],
            template: '<div>原始值{{ initCount }}<button type="button" @click="add()">改变原始值</button></div>',
            data: function() {
                return {
                    count: this.initCount
                }
            },
			methods:{
				add:function(){
					// this.count++
                    this.initCount++
				}
			}
        });
        var app = new Vue({
            el: '#app',
            data: {
                count: 1
            }
        })
    </script>

	</body>
</html>
